<!DOCTYPE html>
<html>
<head>
    <title>预算统计</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <meta name="description" content="木兰湾管理系统">
    <script type="text/javascript" src="../../static/include/header-css.js"></script>
</head>
<body>
<!--导航-->
<div class="weui-tab" style="height:32px;"   id="budgetTab">
    <div class="weui-tab-nav">
        <a href="javascript:getData(2);" class="weui-navbar__item weui-nav-green"> 本月预算 </a>
        <a href="javascript:getData(3);" class="weui-navbar__item weui-nav-green"> 今年预算</a>
    </div>
    <input type="text" style="display:none;" name='type' id="type" value="2"/>
</div>

<!--列表数据显示-->
<div id="dataContent"></div>
<label id="achieveMonthInfo"></label>
<div class="weui-tab" style="height:44px;"   id="statDataTab">
    <div class="weui-tab-nav">
        <a href="javascript:chatStat('LIST');" class="weui-navbar__item weui-nav-green"> 消费与收入分析  </a>
        <!-- 暂时注释图表统计模式，显示有些问题
        <a href="javascript:chatStat('CHAT');" class="weui-navbar__item weui-nav-green"> 图表模式</a>
        -->
    </div>
    <input type="text" style="display:none;" name='statType' id="statType" value="LIST"/>
</div>

<!--饼图数据显示-->
<div id="consumeContainer">
</div>
<div id="incomeContainer">
</div>
<br>

<!--底部按钮-->
<div align="center">
    <a href="javascript:gotoTop();" class="weui-btn weui-btn_mini weui-btn_primary">返回顶部</a>
</div>
<br>
<br>
<script type="text/javascript" src="../../static/include/footer-js.js"></script>
<!--顶部导航使用-->
<script type="text/javascript" src="../../static/js/iscroll-lite.min.js"></script>
<script>
    $(function() {
        $('#budgetTab').tab({defaultIndex:0,activeClass:"bg-green"});
        $('#statDataTab').tab({defaultIndex:0,activeClass:"bg-green"});
        getData(2);
    });
    function getSearchDate(type) {
        var para;
        if(type==2){
            // 查询条件这个月的
            var nowDate = new Date();
            para = {
                startDate: getFirstDayOfMonth(nowDate),
                endDate: getLastDayOfMonth(nowDate)
            };
        }else if(type==3){
            // 查询条件今年的
            para = {
                startDate: getYear(0)+'-01-01',
                endDate: getYear(0)+'-12-31'
            };
        }
        return para;
    }
    function getData(type) {
        $('#type').val(type);
        var para = getSearchDate(type);
        var url='/main/generalStat';
        doAjax(para,url,'GET',false,function(data){
            if(type==2){
                createMonthData(data);
            }else{
                createYearData(data);
            }
            //统计
            chatStat($('#statType').val());
        });
    }
    function chatStat(statType) {
        $('#statType').val(statType);
        statConsume();
        statIncome();
    }
    function statConsume(){
        var type= $('#type').val();
        var para = getSearchDate(type);
        var url='/buyRecord/statWithTreat';
        doAjax(para,url,'GET',false,function(data){
            var statType= $('#statType').val();
            if(statType=='LIST'){
                createListData(data,'buy.png','consumeContainer');
            }else{
                //生成饼图
                createPieDataEnhanced(data,'consumeContainer');
            }
        });
    }
    function statIncome(){
        var type= $('#type').val();
        var para = getSearchDate(type);
        var url='/income/stat';
        doAjax(para,url,'GET',false,function(data){
            var statType= $('#statType').val();
            if(statType=='LIST'){
                createListData(data,'income.png','incomeContainer');
            }else{
                //生成饼图
                createPieDataEnhanced(data,'incomeContainer');
            }
        });
    }
    function createListData(pieData,image,container) {
        var html='';
        var title = '<font color="green">'+pieData.title+'('+pieData.subTitle+')</font>';
        if(image=='buy.png'){
            title = '<a href="../buy/buyRecord.html" >'+title+'</a>\n';
        }else{
            title = '<a href="../fund/income.html" >'+title+'</a>\n';
        }
        html+='    <div class="weui-cells__title">'+title+'</div>\n';
        html+='    <div class="weui-cells">\n';
        if(pieData.detailData[0].data!=null&&pieData.detailData[0].data.length>0){
            var n= pieData.detailData[0].data.length;
            var total=0;
            for(var i=0;i<n;i++){
                var dd = pieData.detailData[0].data[i];
                total+=dd.value;
            }
            var sortData = pieData.detailData[0].data;
            sortData.sort(function(a,b){
                return b.value-a.value;
            });
            for(var i=0;i<n;i++){
                var dd = sortData[i];
                html+='        <div class="weui-cell">\n';
                html+='         <div class="weui-cell__hd"><img src="../../static/image/'+image+'" alt="" style="width:20px;margin-right:5px;display:block"></div>\n';
                html+='            <div class="weui-cell__bd">\n';
                html+='                <p>'+dd.name+'</p>\n';
                html+='            </div>\n';
                var pp = getPercentWithSambol(dd.value,total);
                var ss = '￥'+dd.value+'('+pp+')';
                html+='            <div class="weui-cell__ft">'+ss+'</div>\n';
                html+='         </div>\n';
            }
        }
        html+='    </div>\n';
        setElementInnerHTML(container,html);
    }
    function createMonthData(rowData) {
        var html='';
        html+='<div class="weui-form-preview">';
        html+='    <a class="weui-cell  weui-cell_access weui-cell_example" href="budgetDetail.html?period=MONTHLY">\n';
        html+='        <div class="weui-cell__hd"><img src="../../static/image/budget.png"></div>\n';
        html+='        <div class="weui-cell__bd">\n';
        html+='<label class="weui-form-preview__label mulanbay-dark-font">本月预算:￥'+rowData.monthBudget+'</label>';
        html+='        </div>\n';
        html+='        <div class="weui-cell__ft">本月已经过去:'+rowData.dayMonthRate.toFixed(0)+'%</div>\n';
        html+='    </a>\n';
        html+='    <div class="weui-form-preview__bd">\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">本月已经消费</label>\n';
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">￥'+rowData.monthConsumeAmount.toFixed(2)+'</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">本月消费/预算比例</label>\n';
        var cc='';
        if(rowData.monthBudget>0){
            cc = getPercent(rowData.monthConsumeAmount,rowData.monthBudget);
        }
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">'+cc+'%</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">本月剩余可消费</label>\n';
        var remain = rowData.monthBudget -rowData.monthConsumeAmount;
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">￥'+remain.toFixed(2)+'</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">月度收入</label>\n';
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">￥'+rowData.totalIncome+'</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">看病(自费)</label>\n';
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">￥'+rowData.totalTreatAmount+'</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">新增存款</label>\n';
        var vremainMoney = (rowData.totalIncome- rowData.totalConsumeAmount).toFixed(2);
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">￥'+vremainMoney+'</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">年度总预算</label>\n';
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">￥'+rowData.yearBudget+'</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">消费预测</label>\n';
        var aa = rowData.monthConsumeAmount*rowData.monthDays/rowData.monthPassDays;
        var sss='';
        if(aa>rowData.monthBudget){
            sss+='<font color="red">本月预期总消费金额:'+formatMoneyWithSymbal(aa)+'元,超出预算值'+formatMoneyWithSymbal(aa-rowData.monthBudget)+'元</font>';
        }else{
            sss+='<font color="green">本月预期总消费金额:'+formatMoneyWithSymbal(aa)+'元,低于预算值'+formatMoneyWithSymbal(rowData.monthBudget-aa)+'元</font>';
        }
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">'+sss+'</span>\n';
        html+='        </div>\n';
        html+='    </div>\n';
        html+='    <div class="weui-form-preview__ft">\n';
        html+='        <a class="weui-form-preview__btn weui-form-preview__btn_primary" href="budgetLogStat.html?period=MONTHLY">历史预算</a>\n';
        html+='        <a class="weui-form-preview__btn weui-form-preview__btn_primary" href="budgetDetail.html?period=MONTHLY">预算列表</a>\n';
        html+='        <a class="weui-form-preview__btn weui-form-preview__btn_primary" href="budgetTimeline.html?period=MONTHLY">进度统计</a>\n';
        html+='    </div>\n';
        html+='</div>\n';
        html+='<br>\n';
        setElementInnerHTML('dataContent',html);
    }
    function createYearData(rowData) {
        var html='';
        html+='<div class="weui-form-preview">';
        html+='    <a class="weui-cell  weui-cell_access weui-cell_example" href="budgetDetail.html?period=YEARLY">\n';
        html+='        <div class="weui-cell__hd"><img src="../../static/image/budget.png"></div>\n';
        html+='        <div class="weui-cell__bd">\n';
        html+='<label class="weui-form-preview__label mulanbay-dark-font">今年预算:￥'+rowData.yearBudget+'</label>';
        html+='        </div>\n';
        html+='        <div class="weui-cell__ft mulanbay-dark-font">已消费:￥'+(rowData.totalConsumeAmount+rowData.totalTreatAmount).toFixed(2)+'</div>\n';
        html+='    </a>\n';
        html+='    <div class="weui-form-preview__bd">\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">今年收入</label>\n';
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">￥'+rowData.totalIncome+'</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">今年消费/预算比例</label>\n';
        var cc='';
        if(rowData.yearBudget>0){
            cc = getPercent((rowData.totalConsumeAmount+rowData.totalTreatAmount),rowData.yearBudget);
        }
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">'+cc+'%</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">今年剩余可消费</label>\n';
        var remain = rowData.yearBudget -(rowData.totalConsumeAmount+rowData.totalTreatAmount);
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">￥'+remain.toFixed(2)+'</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">看病(自费)</label>\n';
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">￥'+rowData.totalTreatAmount+'</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">新增存款</label>\n';
        var vremainMoney = rowData.totalIncome- rowData.totalConsumeAmount;
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">￥'+vremainMoney+'</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">本月预算</label>\n';
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">￥'+rowData.monthBudget+'</span>\n';
        html+='        </div>\n';
        html+='    </div>\n';
        html+='    <div class="weui-form-preview__ft">\n';
        html+='        <a class="weui-form-preview__btn weui-form-preview__btn_primary" href="budgetDetail.html?period=YEARLY">预算列表</a>\n';
        html+='        <a class="weui-form-preview__btn weui-form-preview__btn_primary" href="budgetTimeline.html?period=YEARLY">进度统计</a>\n';
        html+='    </div>\n';
        html+='</div>\n';
        html+='<br>\n';
        setElementInnerHTML('dataContent',html);
    }
</script>
</body>
</html>